<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2020/6/9
  Time: 17:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>

<%@include file="head.jsp"%>
<body>

<div id="dowebok">
    <!--轮播图-->
    <div id="carousel-example-generic" class="carousel slide banner section" data-ride="carousel">
        <!-- 圆点 -->
        <ol class="carousel-indicators">
            <li data-target="#carousel-example-generic" data-slide-to="0" class="active "></li>
            <li data-target="#carousel-example-generic" data-slide-to="1"></li>
            <li data-target="#carousel-example-generic" data-slide-to="2"></li>
        </ol>

        <!-- 图片区域 -->
        <div class="carousel-inner" role="listbox">
            <div class="item active slide">
                <img src="img/index-bn1.jpg" alt="">
            </div>
            <div class="item slide">
                <img src="img/index-bn2.png" alt="">
            </div>
            <div class="item slide">
                <img src="img/index-bn3.png" alt="">
            </div>
        </div>
    </div>

    <!--新闻中心-->
    <div class="news section">
        <div class="container">
            <div class="row">
                <div class="common-title">
                    <h2>新闻中心</h2>
                    <span>News Center</span>
                    <p>
                        <i></i>
                        <i></i>
                    </p>
                </div>
            </div>
            <div class="row news-content">
                <div class="col-lg-4 col-md-4 col-sm-4">
                    <div class="thumbnail">
                        <img src="img/news-1.jpg" alt="" class="img-responsive">
                        <div class="caption">
                            <h3>谈多肉植物种子萌发的必要条件！</h3>

                        </div>
                        <div class="news-des">
                            <p>多肉植物种子萌发的必要条件有那些?！为什么有的童鞋种多肉总是不出芽？种子是有生命的，成熟的多肉种子，在没有取得一定外界条件时，是处在休眠状态下的，种子里的胚几乎完全停止生长...</p>
                        </div>
                        <div class="news-more">
                            <time class="date">
                                <span class="glyphicon glyphicon-time"></span>&nbsp;&nbsp;&nbsp;2019-09-21
                            </time>
                            <a href="news-detail1.jsp" class="more">
                                <span class="glyphicon glyphicon-list-alt"></span>&nbsp;&nbsp;&nbsp;查看详情
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-4">
                    <div class="thumbnail">
                        <img src="img/news-2.jpg" alt="" class="img-responsive">
                        <div class="caption">

                            <h3>多肉植物怎么养肥？最重要的关键在的童鞋种多肉</h3>
                        </div>
                        <div class="news-des">
                            <p>多肉植物怎么养肥？好多新手肉丝都在想，怎样把肉肉养得肥一点？胖一点？好吧，多肉植物论坛站长波斯猫一鼓作气，整理了以下几条，嫌你家肉肉苗条的你，不妨一试哦。</p>
                        </div>
                        <div class="news-more">
                            <time class="date">
                                <span class="glyphicon glyphicon-time"></span>&nbsp;&nbsp;&nbsp;2019-10-08
                            </time>
                            <a href="news-detail2.jsp" class="more">
                                <span class="glyphicon glyphicon-list-alt"></span>&nbsp;&nbsp;&nbsp;查看详情
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-4">
                    <div class="thumbnail">
                        <img src="img/news-3.jpg" alt="" class="img-responsive">
                        <div class="caption">

                            <h3>多肉脸盲是这样搞出来的?</h3>
                        </div>
                        <div class="news-des">
                            <p>有些多肉品种的名字你根本叫不出来，因为它们是杂出来的，你可能没想到有多少多肉爱好者在多肉杂交这件事上的兴趣有多浓厚，譬如下文的肉山丨大魔王，杂交了许多多肉，回首移苗，不堪痛苦，尤爱拿月影杂交，</p>
                        </div>
                        <div class="news-more">
                            <time class="date">
                                <span class="glyphicon glyphicon-time"></span>&nbsp;&nbsp;&nbsp;2019-04-30
                            </time>
                            <a href="news-detail.jsp" class="more">
                                <span class="glyphicon glyphicon-list-alt"></span>&nbsp;&nbsp;&nbsp;查看详情
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--公司简介-->
    <div class="introduce section">
        <div class="container">
            <div class="row">
                <div class="common-title">
                    <h2>多肉简介</h2>
                    <span>Company Profile</span>
                    <p>
                        <i></i>
                        <i></i>
                    </p>
                </div>
            </div>
            <div class="row intro-content">
                <p>多肉植物（succulent plant）是指植物根、茎、叶三种营养器官中至少有一种是肥厚多汁，具备储藏大量水分功能的。且其至少具有一种肉质组织，这种组织是一种活组织，除其他功能外，它能储藏可资源利用的水，在土壤含水状况恶化，植物根系不能再从土壤中吸收和提供必要水分时，它能使植物暂时脱离外部水分供应而独立生存。[1]  目前据粗略统计，全世界共有多肉植物一万余种，在分类上隶属100余科。
                </p>
                <a href="about.jsp" class="pull-right">+ 查看详情</a>
            </div>
        </div>
    </div>

    <!--产品中心-->
    <div class="product section">
        <div class="container">
            <div class="row">
                <div class="common-title" style="margin-bottom: 1em;">
                    <h2>多肉的种类</h2>
                    <span>Type</span>
                    <p>
                        <i></i>
                        <i></i>
                    </p>
                </div>
            </div>
            <div class="row pro-content marquee">
                <ul>
                    <li><a href="pro1.jsp"><img src="img/pro-1.jpg"/><em></em></a></li>
                    <li><a href="pro2.jsp"><img src="img/pro-2.jpg"/><em></em></a></li>
                    <li><a href="pro3.jsp"><img src="img/pro-3.jpg"/><em></em></a></li>
                    <li><a href="pro1.jsp"><img src="img/pro-1.jpg"/><em></em></a></li>
                    <li><a href="pro2.jsp"><img src="img/pro-2.jpg"/><em></em></a></li>
                    <li><a href="pro3.jsp"><img src="img/pro-3.jpg"/><em></em></a></li>
                </ul>
            </div>
        </div>

        <div style="text-align: center; margin-top: 2.7em;">
            <a href="pro.jsp"style="color: #fff; border: 1px solid #e7e7e7; background: #3e8f3e; padding: 10px 40px;">查看更多</a>
        </div>
    </div>

    <!--视频中心-->
    <div class="video section" style="padding-top: 3em;">
        <div class="container">
            <div class="row">
                <div class="common-title" style="margin-top: 1.5em;">
                    <h2>多肉百科</h2>
                    <span>Problem Center</span>
                    <p>
                        <i></i>
                        <i></i>
                    </p>
                </div>
            </div>
            <div class="row video-content">
                <div class="col-lg-3 col-md-3 col-sm-3">
                    <!-- Nav tabs -->
                    <ul class="nav nav-tabs video-tab" role="tablist">
                        <li class="video-tab-title hidden-xs">
                            <h3>百科列表</h3>
                        </li>
                        <li role="presentation">
                            <a href="#home" aria-controls="home" role="tab" data-toggle="tab">
                                买多肉植物怎样避免上当受骗？
                            </a>
                        </li>
                        <li role="presentation">
                            <a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">多肉培养手册</a>
                        </li>
                        <!--<li role="presentation">
                            <a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">多肉的习性及分类</a>
                        </li>-->
                    </ul>
                </div>
                <div class="col-lg-9 col-md-9 col-sm-9 video-tab-cont" style="padding-bottom: 2em;">
                    <!-- Tab panes -->
                    <div class="tab-content">
                        <div role="tabpanel" class="tab-pane active" id="home">
                            <div class="embed-responsive embed-responsive-16by9">
                                <p>
                                    骗术1：鱼目混珠篇
                                    <br>&nbsp&nbsp&nbsp&nbsp这种骗人的计量多见于贵货之中，因为便宜的多肉利润本来就低。3元钱的肉即使100%的利润还是3元。下面拿个较为常见的例子来分析。
                                    <br>&nbsp&nbsp&nbsp&nbsp目前比较多见的有：
                                    <br>&nbsp&nbsp&nbsp&nbsp现在很多不良卖家都拿桃美人冒充桃蛋，原因是他们区别真是非常非常小，实物会比图片区别更小。
                                    <br>&nbsp&nbsp&nbsp&nbsp价格上桃美人小苗网上应该是10元左右，桃蛋在30-40元左右，花卉市场的桃蛋至少是50-90元左右。价格还是相差比较悬殊的。
                                    <br>&nbsp&nbsp&nbsp&nbsp前面说了，凡是这样的普遍都是贵货。如果非要网上买的话，强烈建议选择一物一拍的卖家。这样可以先让懂行的朋友看过之后再购买，即便上当退货时也算留有证据。	</p>
                                <p>
                                    骗术2：无中生有篇
                                    <br>&nbsp&nbsp&nbsp&nbsp入坑一段时间的肉友，肯定会被多肉植物繁殖的魅力深深的吸引。如果能自己繁殖成功一些苗的话，不仅能带来很大的成就感。或许还能小赚一笔。所以很多肉友选择购种繁殖。由于多肉的种子非常小，如同灰尘，即便是入坑多年有经验的肉友也很难分辨。而且种子出苗时间长，等出苗了网上的订单早已自动确认交易，只能完全看人品了。由于多肉打种非常困难，尤其贵货可以说是难上加难，经网友反馈在国内买种起苗率能达到70%就算是人品大爆发了。可以说某宝上60%的种子卖家都是假货，不是种不出来就是种出来的不是肉，这绝对不是耸人听闻，这也是导致国外种子公司大卖的原因。在这里园长推荐大家一个良心种子公司德国KK，看《德国KK种子公司下单攻略》，不过上面好的品种早已被国内肉友买光，大家可以没事就上去看看，他们会不定时更新种子的销售列表。
                                </p>
                                <p>
                                    骗术3徒长不等于老桩
                                    <br>&nbsp&nbsp&nbsp&nbsp很多新入坑的肉友，看到老桩之美，什么韩国老桩等萌图后就疯狂追捧。

                                    <br>&nbsp&nbsp&nbsp&nbsp徒长指的是植物茎叶疯狂伸长的现象，失去原来矮壮的样子，一般是缺少日照，光线过暗，浇水又相对较多造成的。已经徒长的植物，不可能再变回原样了，这时要增加光照、控水，等春秋生长期，可以采取“砍头”的方式截下顶部晾干伤口后枝插。一定记得晒足太阳（夏天正午除外），若是不能保证日照，浇水就略控制些。
                                    <br>&nbsp&nbsp&nbsp&nbsp而老桩，是指那些生长多年、有明显主干或分枝的多肉植物老株，一般的多肉植物老桩都是景天科植物。花友在购买多肉老桩的时候一定要擦亮眼睛，因为老桩是需要时间的，少则一年二年多则需要三五年才能形成一株好的老桩，但有很多商家谋利心切，用一些手段制造多肉植物老桩，比如直接扦插独立的茎干，或者故意把植株放在缺少光照的地方任其徒长，然后掰掉下部的叶子，制造多肉“老桩”。
                                </p>
                            </div>
                        </div>
                        <div role="tabpanel" class="tab-pane" id="profile">
                            <div class="embed-responsive embed-responsive-16by9">
                                <p>
                                    多肉植物四季养护之春季（3-5月）
                                    <br>&nbsp&nbsp&nbsp&nbsp一年内，大半的多肉植物种类在春天季生长较快。气温上升后，植物的根部活动变快，盆中的土也干得比较快。 因此要积极补充水分，表面干后就可以浇水浇透。  冬天一直被闷在房间里面的多肉植物也可以在这个季节转移到室外,充分享受曰光和风的招抚。但是，这个时候曰照变强，如果突然拿到室外还是很容易晒伤。可以先选择在多云的日子拿出去，或者晴天拿出去的时候 先用报纸遮盖一下，等到多肉植物适应了光照，再取下。寒潮霜降的曰子，晚上还是放到室内为好。</p>
                                <p> 
                                    多肉植物四季养护之夏季（6-8月） 
                                    <br>&nbsp&nbsp&nbsp&nbsp夏天是多肉植物比较难度过的一个季节。这个时期，湿度较大，空气中水分比较多，光靠空气中的水分多肉植物就可以生存，可控制浇水。但是如果植物体积过小，3个月不给水也会干枯，因此可以可通过叶子的状况判断， 选在凉爽的夜晚补充水分。 
                                    多肉植物放在房间需要注意通风，请尽量不要放置在密闭的房间内。如果房间有空调问题不大，但空调也 会给植物增加压力，尽呈不要放在直对空调出风口的地方。 </p>
                                <p>
                                     
                                    多肉植物四季养护之秋季（9-11月） 
                                    <br>&nbsp&nbsp&nbsp&nbsp让那些夏天受到摧残的多肉植物慢慢恢复健康吧。天气渐凉，多肉植物也开始慢慢呈现红色。首先要给植物浇水，干枯的叶片吸收到水分以后会慢慢恢复健康，再次萌发。 
                                    夏天为了避免强烈日照而转移到遮阴处的多肉们开始重新转移到日照充足的地方。如果一直放在日照不是很充足的地方，叶片没有办法变成好看的红色。曰照充分，你就能感受到秋天带给多肉植物的美好色彩。
                                </p>
                                <p>
                                    多肉植物四季养护之冬季（12-2月） 
                                    <br>&nbsp&nbsp&nbsp&nbsp人们印象中多肉植物是不耐寒冷，不容易过冬。温度低的时候为了防止霜冻，要减少浇水频率。水少后，多肉 植物体内的浓度变高，不容易上冻。和夏季一样,控制浇水。特别是不耐寒的品种可以完全不用浇水。 
                                    不耐寒的品种叶片会掉落，完全停止生长逬入休眠。这些品种到春天为止可以完全断水，等待新芽的复苏。 必须室内过冬，放在有光线的窗边，尽量曰照。晚上植物放在离窗边稍远的地方防冻。
                                </p>
                            </div>
                        </div>
                        <div role="tabpanel" class="tab-pane" id="messages">
                            <div class="embed-responsive embed-responsive-16by9">

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
<%--    <div class="container section" style="margin-top: -70px;--%>
<%--    margin-bottom: 35px; width: 1200px;">--%>
<%--        <div class="common-title" style="margin-top: 1.5em;">--%>
<%--            <h2>多肉联盟</h2>--%>
<%--            <span>Fleshy Alliance</span>--%>
<%--            <p>--%>
<%--                <i></i>--%>
<%--                <i></i>--%>
<%--            </p>--%>
<%--        </div>--%>
<%--        <div class="page_left col-lg-3 col-md-3 col-sm-3 col-xs-12" style="margin-top: 30px;">--%>
<%--            <div style="margin-bottom: 30px;">--%>
<%--                <img src="img/weizhi.png"><span style="color: #ccc; margin-left: 20px; font-size: 18px;">智谷创意产业园</span>--%>
<%--            </div>--%>
<%--            <div style="margin-bottom: 30px;">--%>
<%--                <img src="img/phone.png"><span style="color: #ccc; margin-left: 20px; font-size: 18px;">0512-57995109</span>--%>
<%--            </div>--%>
<%--            <div style="margin-bottom: 30px;">--%>
<%--                <img src="img/shouji.png"><span style="color: #ccc; margin-left: 20px; font-size: 18px;">15995656015</span>--%>
<%--            </div>--%>
<%--            <div style="margin-bottom: 30px;">--%>
<%--                <img src="img/email.png"><span style="color: #ccc; margin-left: 20px; font-size: 18px;">Cindy@kindjob.cn</span>--%>
<%--            </div>--%>
<%--        </div>--%>
<%--        <div class="page_right col-lg-9 col-md-9 col-sm-9 col-xs-12">--%>
<%--            <div class="page_content">--%>
<%--                <form action="" class="message_form" id="regsiterForm">--%>
<%--                    <div class="form-group">--%>
<%--                        <label for="username" class="control-label" style="color: #fff;">--%>
<%--                            姓名<span>*</span>:--%>
<%--                        </label>--%>
<%--                        <div class="controls">--%>
<%--                            <input type="text" class="form-control" id="username" placeholder="请输入您的姓名...">--%>
<%--                            <div class="tip" id="username-tip"></div>--%>
<%--                        </div>--%>
<%--                    </div>--%>
<%--                    <div class="form-group">--%>
<%--                        <div class="control-label" style="color: #fff;">--%>
<%--                            电话<span>*</span>：--%>
<%--                        </div>--%>
<%--                        <div class="controls">--%>
<%--                            <input type="text" class="form-control" id="userphone" placeholder="请输入您的电话...">--%>
<%--                            <div class="tip" id="userphone-tip"></div>--%>
<%--                        </div>--%>
<%--                    </div>--%>
<%--                    <div class="form-group">--%>
<%--                        <div class="control-label" style="color: #fff;">--%>
<%--                            备注：--%>
<%--                        </div>--%>
<%--                        <div class="controls">--%>
<%--                            <textarea type="text" class="form-control beizhu-control" id="userebeizhu" placeholder="请输入您的备注..."></textarea>--%>
<%--                            <div class="tip" id="userebeizhu-tip"></div>--%>
<%--                        </div>--%>
<%--                    </div>--%>
<%--                    <div class="form-group" style="margin-top: 40px;">--%>
<%--                        <button type="button" class="submint_btn" style="padding: 0 35px;">提交</button>--%>
<%--                    </div>--%>
<%--                </form>--%>
<%--            </div>--%>
<%--        </div>--%>
<%--    </div>--%>
<%--    <div class="panel-body" style="height: 400px; overflow-y:scroll">--%>
<%--        <div style="border: 1px  #000000; width: 90%; margin: 0 auto;">--%>
<%--                <span>--%>

<%--            </span>--%>
<%--        </div>--%>
<%--    </div>--%>

    <script src="js/jquery-3.1.1.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/jquery.fullPage.min.js"></script>


<%--       <script>--%>
<%--           $(function(){--%>
<%--               $('#dowebok').fullpage({--%>
<%--                   sectionsColor : [''],--%>
<%--                   loopBottom: true--%>
<%--               });--%>

<%--               setInterval(function(){--%>
<%--                   $.fn.fullpage.moveSlideRight();--%>
<%--               }, 2000);       });--%>
<%--       </script>--%>

       <script type="text/javascript">
           $(document).ready(function(){
               $('.marquee').kxbdMarquee({
                   direction:'left',
                   eventA:'mouseenter',
                   eventB:'mouseleave'
               });
           });
       </script>

      <script>
           //滚动
           (function($){

               $.fn.kxbdMarquee = function(options){
                   var opts = $.extend({},$.fn.kxbdMarquee.defaults, options);

                   return this.each(function(){
                       var $marquee = $(this);//滚动元素容器
                       var _scrollObj = $marquee.get(0);//滚动元素容器DOM
                       var scrollW = $marquee.width();//滚动元素容器的宽度
                       var scrollH = $marquee.height();//滚动元素容器的高度
                       var $element = $marquee.children(); //滚动元素
                       var $kids = $element.children();//滚动子元素
                       var scrollSize=0;//滚动元素尺寸
                       var _type = (opts.direction == 'left' || opts.direction == 'right') ? 1:0;//滚动类型，1左右，0上下

                       //防止滚动子元素比滚动元素宽而取不到实际滚动子元素宽度
                       $element.css(_type?'width':'height',10000);
                       //获取滚动元素的尺寸
                       if (opts.isEqual) {
                           scrollSize = $kids[_type?'outerWidth':'outerHeight']() * $kids.length;
                       }else{
                           $kids.each(function(){
                               scrollSize += $(this)[_type?'outerWidth':'outerHeight']();
                           });
                       }
                       //滚动元素总尺寸小于容器尺寸，不滚动
                       if (scrollSize<(_type?scrollW:scrollH)) return;
                       //克隆滚动子元素将其插入到滚动元素后，并设定滚动元素宽度
                       $element.append($kids.clone()).css(_type?'width':'height',scrollSize*2);

                       var numMoved = 0;
                       function scrollFunc(){
                           var _dir = (opts.direction == 'left' || opts.direction == 'right') ? 'scrollLeft':'scrollTop';
                           if (opts.loop > 0) {
                               numMoved+=opts.scrollAmount;
                               if(numMoved>scrollSize*opts.loop){
                                   _scrollObj[_dir] = 0;
                                   return clearInterval(moveId);
                               }
                           }
                           if(opts.direction == 'left' || opts.direction == 'up'){
                               var newPos = _scrollObj[_dir] + opts.scrollAmount;
                               if(newPos>=scrollSize){
                                   newPos -= scrollSize;
                               }
                               _scrollObj[_dir] = newPos;
                           }else{
                               var newPos = _scrollObj[_dir] - opts.scrollAmount;
                               if(newPos<=0){
                                   newPos += scrollSize;
                               }
                               _scrollObj[_dir] = newPos;
                           }
                       };
                       //滚动开始
                       var moveId = setInterval(scrollFunc, opts.scrollDelay);
                       //鼠标划过停止滚动
                       $marquee.hover(
                           function(){
                               clearInterval(moveId);
                           },
                           function(){
                               clearInterval(moveId);
                               moveId = setInterval(scrollFunc, opts.scrollDelay);
                           }
                       );

                       //控制加速运动
                       if(opts.controlBtn){
                           $.each(opts.controlBtn, function(i,val){
                               $(val).bind(opts.eventA,function(){
                                   opts.direction = i;
                                   opts.oldAmount = opts.scrollAmount;
                                   opts.scrollAmount = opts.newAmount;
                               }).bind(opts.eventB,function(){
                                   opts.scrollAmount = opts.oldAmount;
                               });
                           });
                       }
                   });
               };
               $.fn.kxbdMarquee.defaults = {
                   isEqual:true,//所有滚动的元素长宽是否相等,true,false
                   loop: 0,//循环滚动次数，0时无限
                   direction: 'left',//滚动方向，'left','right','up','down'
                   scrollAmount:1,//步长
                   scrollDelay:10,//时长
                   newAmount:3,//加速滚动的步长
                   eventA:'mousedown',//鼠标事件，加速
                   eventB:'mouseup'//鼠标事件，原速
               };

               $.fn.kxbdMarquee.setDefaults = function(settings) {
                   $.extend( $.fn.kxbdMarquee.defaults, settings );
               };

           })(jQuery);

       </script>


</body>
</html>
